Use self-hosted fonts from cf.gov #841
Conversation
This commit deprecates use of the font files in the private "eregsip" repository, instead using font files located at /static/fonts that are provided by cf.gov. Additionally, the ability to add these fonts locally is provided via a new static.in directory, akin to how cfgov-refresh does it. See documentation here: https://cfpb.github.io/cfgov-refresh/installation/#webfonts I've updated the README to make a note of this.
chosak
requested review from
ascott1,
rosskarchner,
grapesmoker and
niqjohnson
| src: url("../../eregsip/font/e9167238-3b3f-4813-a04a-a384394eed42.eot?iefix") format("embedded-opentype"), | ||
| url("../../eregsip/font/1e9892c0-6927-4412-9874-1b82801ba47a.woff") format("woff"); | ||
| src: url("../../fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot"); | ||
| src: url("../../fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot?iefix") format("embedded-opentype"), |
There was a problem hiding this comment.
You can drop everything but woff and woff2 files. See https://[GHE]/CFPB/hubcap/issues/66
There was a problem hiding this comment.
See cfpb/capital-framework#697 for example.
| url("../../eregsip/font/1e9892c0-6927-4412-9874-1b82801ba47a.woff") format("woff"); | ||
| src: url("../../fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot"); | ||
| src: url("../../fonts/e9167238-3b3f-4813-a04a-a384394eed42.eot?iefix") format("embedded-opentype"), | ||
| url("../../fonts/1e9892c0-6927-4412-9874-1b82801ba47a.woff") format("woff"); |
There was a problem hiding this comment.
Add woff2 format from https://[GHE]/CFGOV/cfgov-fonts
|
@anselmbradford thanks, I don't know a woff from a Waffle House. I'll make those changes. |
|
Fonts updated to use only woff and woff2 format in 0d49600. |
There was a problem hiding this comment.
I'm running eRegs as a standalone app instead of as part of cf.gov, so I couldn't get the fonts to load locally. Here's what I did starting from the root of regulations-site in this branch:
cd static.in/ && git clone https://[GHE]/CFGOV/cfgov-fonts/cd .../frontendbuild.shpython manage.py runserver 8001
That gave me 404 errors for all the Avenir family fonts used on the page (the text in the screenshot is still in Avenir since I have it installed locally):
Digging into the network panel a little, it looks like the other webfont used on the page, cf-icons, is coming from /static/regulations/font/ while the CSS is trying to pull Avenir from /static/fonts/, which doesn't exist in my local setup.
Again, I think this is because I'm running eRegs as a standalone app instead of as part of cf.gov and thus don't have a /static/fonts/ directory. So maybe the only "fix" we need is to note in the readme that you'll need to run eRegs as part of cf.gov to use the fonts locally?
README.md
Outdated
| If you want to install self-hosted fonts locally for use in development, you can place the font files in `/static.in/cfgov-fonts/fonts/` and restart the local web server. If you are a CFPB employee, you can perform this step with: | ||
|
|
||
| ``` | ||
| cd /static.in/ && git clone https://[GHE]/CFGOV/cfgov-fonts/ |
There was a problem hiding this comment.
This might just be me, but I had to drop the leading / in /static.in/ to switch to the right directory (I was in the root of regulations-site at the time):
cd static.in/ && git clone https://[GHE]/CFGOV/cfgov-fonts/
There was a problem hiding this comment.
Yes, you're right, it should be without a leading /. Change made in 35970c5.
|
@niqjohnson thanks for the review. This should work standalone. Do you have a local |
There was a problem hiding this comment.
We discovered the missing fonts were a side effect of how my local_settings.py file was set up to include eregsip. After a few small changes to my local_settings.py, the fonts worked locally as intended.
Since (a) that was a me thing and (b) we're going to get rid of including eregsip as part of this work anyway, this looks 👍 to me.
This commit brings in eRegs assets specific to CFPB that previously lived in a private "eregsip" repository. This includes various reg-specific landing pages, the CFPB logo, and some JS to pull down the latest CFPB-specific regs from the Federal Register. The "default" templates for all regs now include CFPB-specific branding. All mentions and dependencies on the "eregsip" repository should be gone after this PR (now that #841, self-hosted fonts, has been merged).
This commit deprecates use of the font files in the private "eregsip" repository, instead using font files located at
/static/fontsthat are provided by cf.gov. Additionally, the ability to add these fonts locally is provided via a newstatic.indirectory, akin to how cfgov-refresh does it. See documentation here:https://cfpb.github.io/cfgov-refresh/installation/#webfonts
I've updated the README to make a note of this.